<template>
	<view>
		<view class="time">
			开始日期
			<image src="../../static/bot-img.png" mode=""></image>
			<text>至</text>
			结束日期
			<image src="../../static/bot-img.png" mode=""></image>
		</view>
		
		<view class="each">
			<view class="text">桌台使用总时长（分钟）</view>
			<view class="num">20</view>
			
			<image src="../../static/bact.png" mode=""></image>
		</view>
		<view class="each">
			<view class="text">总金额（元）</view>
			<view class="num">38065.00</view>
			
			<image src="../../static/bacm.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F7F8FA;
	}
	.time {
		font-weight: 500;
		font-size: 24rpx;
		color: #A4A9B7;
		padding: 40rpx 32rpx 0 32rpx;
		image {
			width: 12rpx;
			height: 12rpx;
			vertical-align: middle;
			margin-left: 16rpx;
		}
		text {
			font-weight: 500;
			font-size: 24rpx;
			color: #1C274C;
			padding: 0 24rpx;
		}
	}
	
	.each {
		width: 606rpx;
		background: #FFFFFF;
		border-radius: 24rpx 24rpx 24rpx 24rpx;
		margin: auto;
		margin-top: 24rpx;
		padding: 32rpx 40rpx;
		position: relative;
		.text {
			font-weight: 500;
			font-size: 24rpx;
			color: #A4A9B7;
			padding-top: 8rpx;
		}
		.num {
			font-weight: 500;
			font-size: 56rpx;
			color: #1C274C;
			margin-top: 30rpx;
		}
		image {
			width: 173rpx;
			height: 142rpx;
			position: absolute;
			bottom: 0;
			right: 0;
		}
	}
</style>
